﻿<!DOCTYPE html>
<html>
<head>
    <title>OpenLayers Map - google tile</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link rel="stylesheet" href="../theme/default/style.css" type="text/css">
	<script src="../js/jquery-1.7.2.min.js"></script>
    <script src="http://localhost:8989/Openlayer/js/openlayers/lib/OpenLayers.js"></script>
	<script src="./openalyer/Layer/BaiduTile.js"></script>
    <script type="text/javascript">
        var proj = 'EPSG:26915';
        var mapExtent = new OpenLayers.Bounds(-20037726.37, -11708041.66, 20037726.37, 12474104.17);

        var map;
        format = 'image/png';
        function init() {
            map = new OpenLayers.Map('map', {
                //maxExtent: mapExtent,
				//projection: proj,
				//displayProjection: new OpenLayers.Projection("EPSG:4326"),
                controls: [
                    new OpenLayers.Control.Navigation(),
                    new OpenLayers.Control.LayerSwitcher(),
                    new OpenLayers.Control.PanZoomBar(),
                    new OpenLayers.Control.MousePosition()
                ]
            });

            var streetLayer = new OpenLayers.Layer.BaiduTile('Baidu Street', "", {
                sphericalMercator: true,
                //maxExtent: mapExtent,
                isBaseLayer: true,
                projection: proj
            });
            
            var tiled = new OpenLayers.Layer.WMS(
                    "cite:wg - Tiled", "http://localhost:8181/geoserver/cite/wms",
                    {
                        LAYERS: 'cite:wg',
                        STYLES: '',
                        format: format,
                        transparent:true,
                        tiled: true,
                        tilesOrigin : map.maxExtent.left + ',' + map.maxExtent.bottom
                    },
                    {
                        buffer: 0,
                        displayOutsideMaxExtent: true,
                        isBaseLayer: false,
                        yx : {'EPSG:26915' : false}
                    } 
                );
            
                // setup single tiled layer
                var untiled = new OpenLayers.Layer.WMS(
                    "cite:wg - Untiled", "http://localhost:8181/geoserver/cite/wms",
                    {
                        LAYERS: 'cite:wg',
                        STYLES: '',
                        transparent:true,
                        format: format
                    },
                    {
                       singleTile: true, 
                       ratio: 1, 
                       isBaseLayer: false,
                       yx : {'EPSG:26915' : false}
                    } 
                );
        
                //map.addLayers([untiled,tiled]);
                map.addLayers([streetLayer]);
				
				//if (!map.getCenter()) map.zoomToMaxExtent();
        }
        
        
        function mercator2lonlat(mercator){
			var lonlat={x:0,y:0};
			var x = mercator.x/20037508.34*180;
			var y = mercator.y/20037508.34*180;
			y= 180/Math.PI*(2*Math.atan(Math.exp(y*Math.PI/180))-Math.PI/2);
			lonlat.x = x;
			lonlat.y = y;
			return lonlat;
	 }
	 
	 $(document).ready(function(){
	 	var height=$(window).height();
		$("#map").height(height);
		init();
	 });
    </script>
</head>
<body>
    <div id="map" style="width: 100%; height: 600px">
    </div>
</body>

</html>